<!-- src/modules/dashboard/components/StatsCard.vue -->
<template>
  <el-card class="stats-card">
    <div slot="header" class="card-header">
      <span>{{ title }}</span>
    </div>
    <div class="card-content">
      <h2>{{ value }}</h2>
    </div>
  </el-card>
</template>

<script lang="ts">
import { defineComponent } from 'vue';

export default defineComponent({
  name: 'StatsCard',
  props: {
    title: {
      type: String,
      required: true
    },
    value: {
      type: String,
      required: true
    }
  }
});
</script>

<style scoped>
.stats-card {
  width: 250px;
  margin: 10px;
}
.card-header {
  font-size: 16px;
  font-weight: bold;
}
.card-content {
  font-size: 24px;
  color: #409eff;
}
</style>
